<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>组件基础-通过插槽分发内容slot</title>
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    <style>

    </style>
</head>
<body>
<div id="app">

    <!--实现打印hi，Alice——通过增加插槽-->
    <child-component >
        <h3 style="color: crimson">Alice</h3>
    </child-component>
</div>


<script>
    Vue.component("child-component",{
       template:"<div>hi <slot></slot></div>"
    });
    var app= new Vue({
        el:'#app',
        data:{
            searchText:'',
        },
        methods:{

        }
    })
</script>
</body>
</html>
